<template xmlns:v-on="http://www.w3.org/1999/xhtml">
    <div id="app" class="record">
        <div class="recordNav">
            <div>
                <div><span class="glyphicon glyphicon-file"></span></div>
                <div>日志查看</div>
            </div>
            <div class="userNavT">
                <div>
                    <div><span class="glyphicon glyphicon-file"></span></div>
                    <div>当前位置：</div>
                </div>
                <div>
                    日志查看
                </div>
            </div>
        </div>
        <div class="recordDetails">
            <div class="datails" v-loading.body="loading" element-loading-text="添加中...">
                <ul>
                    <li class="firstLi">
                        <div>姓名</div>
                        <div>操作动作</div>
                        <div>时间</div>
                    </li>
                    <li v-if="nullShow" class="nullLi">
                        <div>暂时没有参数</div>
                    </li>
                    <li v-else v-for="(record,index) in items" class="detaLi">
                        <div>{{record.admin}}</div>
                        <div>{{record.action}}</div>
                        <div>{{record.ctime | ctimeFun}}</div>
                    </li>
                    <li class="lastLi">
                        <div class="lastSel">
                            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 20, 30, 40]" :page-size="pageSizeNum"
                                layout="total, sizes, prev, pager, next" :total="totalNum">
                                </el-pagination>
                        </div>
                        <div class="lastPag">
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</template>
<script>
    import { mapActions } from 'vuex'
    export default {
        name: 'admin',
        data() {
            return {
                loading: false,
                nullShow: true,
                pageSizeNum: 10,
                totalNum: 0,
                currentPage: 1,
                items: []
            }
        },
        filters: {
            ctimeFun: function (val) {
                var now = new Date(val)
                var year = now.getYear() - 100;
                var month = now.getMonth() + 1;
                month = month > 9 ? month : "0" + month
                var date = now.getDate();
                date = date > 9 ? date : "0" + date
                var hour = now.getHours();
                hour = hour > 9 ? hour : "0" + hour
                var minute = now.getMinutes();
                minute = minute > 9 ? minute : "0" + minute
                return "20" + year + "-" + month + "-" + date + "   " + hour + ":" + minute;
            }
        },
        created: function () {
            var userName = sessionStorage.getItem('userName')
      
        },
        methods: {
            // 商户设置每页个数
            handleSizeChange(val) {
                this.pageSizeNum = val;
                this.currentPage = val;
                var self = this;
                self.loading = true
                self.getLogAll({
                    pageSize: val,
                    number: 1
                }).then((data) => {
                    
                    self.loading = false
                    if (data.data.code == "200") {
                        if (data.data.data.content.length > 0) {
                            self.nullShow = false
                            self.items = data.data.data.content
                            self.totalNum = data.data.data.totalElements
                        } else {
                            self.nullShow = true
                        }
                    }
                }).catch(msg => console.log(msg))
            },
            // 商户点击分页
            handleCurrentChange(val) {
                this.currentPage = val;
                var self = this;
                self.loading = true
                self.getLogAll({
                    pageSize: self.pageSizeNum,
                    number: val
                }).then((data) => {
                    self.loading = false
                    if (data.data.code == "200") {
                        if (data.data.data.content.length > 0) {
                            self.nullShow = false
                            self.items = data.data.data.content
                            self.totalNum = data.data.data.totalElements
                        } else {
                            self.nullShow = true
                        }
                    }
                }).catch(msg => console.log(msg))
            },
            ...mapActions(['getLogAll'])
        }
    }

</script>
<style scoped src="../../assets/css/record.css">

</style>